<style scoped lang="less">
  @import "./index.less";
</style>

<template>
  <div class="g-header" :class="{ home: isHome }">
    <div class="m-cont">
      <router-link to="/" class="u-logo">
        <img src="../../assets/logo.svg" title="MINEH5UI" alt="mineh5ui logo" />
      </router-link>
      <div class="m-rt-list">
        <nav-list :list="navList"></nav-list>
      </div>
    </div>
  </div>
</template>

<script lang="ts">
  import { defineComponent } from "vue";
  import NavList from "@/components/NavList";
  import { useListData } from "./hooks";

  export default defineComponent({
    name: "MineHeader",
    components: {
      NavList
    },
    setup() {
      const { navList, isHome } = useListData();
      return { navList, isHome };
    }
  });
</script>
